<script setup>
const tableData = [
  {
    date: '2016-05-03',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles'
  },
  {
    date: '2016-05-02',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles'
  },
  {
    date: '2016-05-04',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles'
  },
  {
    date: '2016-05-01',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles'
  },
  {
    date: '2016-05-08',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles'
  },
  {
    date: '2016-05-06',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles'
  },
  {
    date: '2016-05-07',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles'
  }
]
const handleEidt = (row) => {
  console.log(row)
}
const handleDelete = (row) => {
  console.log(row)
}
</script>
<template>
  <!-- <el-card>
    <template #header>
      <el-space alignment="center">
        <span>分类管理</span>
        <el-button type="primary">添加分类</el-button>
      </el-space>
    </template>
    <el-table :data="tableData">
      <el-table-column label="date" prop="date"></el-table-column>
      <el-table-column label="name" prop="name"></el-table-column>
      <el-table-column label="address" prop="address"></el-table-column>
      <el-table-column label="操作">
        <template #default="scope">
          <el-button type="primary" @click="handleEidt(scope.row)"
            >编辑</el-button
          >
          <el-button type="danger" @click="handleDelete(scope.row)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </el-card> -->
  <CommonHeader>
    <template #title>分类管理</template>
    <template #body><el-button type="primary">添加分类</el-button></template>
    <template #default>
      <el-table :data="tableData">
        <el-table-column label="date" prop="date"></el-table-column>
        <el-table-column label="name" prop="name"></el-table-column>
        <el-table-column label="address" prop="address"></el-table-column>
        <el-table-column label="操作">
          <template #default="scope">
            <el-button type="primary" @click="handleEidt(scope.row)"
              >编辑</el-button
            >
            <el-button type="danger" @click="handleDelete(scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </template>
  </CommonHeader>
</template>
<style scoped>
.el-table__body {
  width: 100%;
  height: 100%;
}
</style>
